require("../css/register.less")

require("../lib/captcha/captcha-mini.js")

//表单验证
//获取元素
document.ready(function () {
    let code = undefined
    let usname = document.querySelector("#usname")
    let pwd1 = document.querySelector("#pwd1")
    let pwd2 = document.querySelector("#pwd2")
    let verify = document.querySelector("#verify")
    let regbtn = document.querySelector("button")

    let captcha1 = new CaptchaMini({
        length: 5,
        lineNum: 6,
        dotNum: 10,
        fontSize: 60
    })
    captcha1.draw(document.querySelector("#captcha"), r => {
        code = r
    })
    //验证码框失去焦点事件
    let bool1 = true
    verify.addEventListener("blur", function () {
        if (verify.value == code) {
            bool1 = true
            console.log("验证码通过");
        } else {
            bool1 = false
        }
    })
    //表单提交事件
    regbtn.addEventListener("click", function (e) {
        // alert(1)
        let bool = bool1 && Pwd1flag && Pwd2flag
        if (bool) {
            console.log("验证通过");
            window.$http.post("/users/add", {
                account: usname.value,
                password: pwd1.value
            }, function (res) {
                console.log(res);
                if (res.status == 0) {
                    location.href = "./login.html"
                }
            })
        }
    })
    //手机号框验证
    let Telflag = false
    var reg_tel = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/;
    usname.addEventListener("blur", function () {
        let bool = reg_tel.test(usname.value)
        if (!bool) {
            console.log("无效的手机号");
            Telflag = false
            this.classList.add("change")
        } else {
            console.log("手机号验证通过");
            Telflag = true
        }
    })

    //密码框验证
    var reg_pwd = /^[0-9]{6,18}$/;
    let Pwd1flag = true
    pwd1.addEventListener("blur", function () {
        let bool = reg_pwd.test(pwd1.value)
        if (!bool) {
            console.log("无效的密码");
            Pwd1flag = false
        } else {
            if (pwd2.value == "") {
                Pwd1flag = true
            } else {
                if (pwd1.value == pwd2.value) {
                    console.log("验证通过");
                    Pwd1flag = true
                }
                else {
                    console.log("两次密码不一致");
                    Pwd1flag = false
                }
            }
        }
    })

    //第二个密码框的验证
    let Pwd2flag = true
    pwd2.addEventListener("blur", function () {
        let bool = reg_pwd.test(pwd2.value)
        if (!bool) {
            console.log("无效的密码");
            Pwd2flag = false
        } else {
            if (pwd1.value == "") {
                Pwd2flag = true
            } else {
                if (pwd1.value == pwd2.value) {
                    console.log("验证通过");
                    Pwd2flag = true
                }
                else {
                    console.log("两次密码不一致");
                    Pwd2flag = false
                }
            }
        }
    })
})

